﻿<div ng-mouseenter="isHovered = true" ng-mouseleave="isHovered = false">
    <div class="dskb-group" ds:kanban-draggable-item drag-type="dskb.groupType" drag-index="dskb.groups.indexOf(group)" is-dragging-parent="true" ng-style="{ backgroundColor: group.backgroundColor ? group.backgroundColor : (group.itemType && group.itemType.backgroundColor ? group.itemType.backgroundColor : dskb.defaultGroupType.backgroundColor) }">
        <table>
            <tr>
                <td class="dskb-gripper" ng-style="{ backgroundColor: group.color ? group.color : (group.itemType ? group.itemType.color : dskb.defaultGroupType.color) }">&nbsp;</td>
                <td class="dskb-group-content">
                    <div class="dskb-property dskb-property-editor">
                        <input type="text" ng-model="group[dskb.groupNameField]" readonly="readonly"/>
                    </div>
                    <table ng-hide="group.isCollapsed" class="dskb-property dskb-property-editor dskb-property-table">
                        <tr>
                            <td>
                                <img ng-if="dskb.assignableResources && group.assignedResource.imageUrl" ng-src="{{ group.assignedResource.imageUrl }}" class="dskb-property-image"/>
                            </td>
                            <td class="dskb-property-table">
                                <input ng-model="dskb.assignableResources ? group.assignedResource.name : null" ng-model-options="{ getterSetter: true }" readonly="readonly" class="dskb-property-secondary dskb-select-replacement"/>
                            </td>
                        </tr>
                    </table>
                    <table ng-hide="group.isCollapsed" class="dskb-property dskb-property-editor dskb-property-table">
                        <tr>
                            <td>
                                <span class="dskb-property-label">{{ dskb.stateLabel }}:</span>
                            </td>
                            <td class="dskb-property-table">
                                <input ng-model="group.state.name" readonly="readonly" class="dskb-select-replacement"/>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </div>
    <div ng-hide="dskb.isReadOnly || group.isReadOnly" class="dskb-editors-area dskb-group-editors-area" ng-style="{ backgroundColor: group.backgroundColor ? group.backgroundColor : (group.itemType && group.itemType.backgroundColor ? group.itemType.backgroundColor : dskb.defaultGroupType.backgroundColor) }">
        <div class="dskb-item-commands-container" ng-show="dskb.onEditingGroup && isHovered">
            <a ng-hide="dskb.areEditItemButtonsHidden || dskb.areEditGroupButtonsHidden || group.isEditItemButtonHidden || group.state.areEditItemButtonsHidden" href="javascript://" ng-click="dskb.onEditingGroup({group: group})" class="dskb-button dskb-edit-button" title="{{ dskb.editGroupButtonToolTip }}">
                {{ dskb.editGroupButtonText }}
            </a>
        </div>
        <div ng-hide="dskb.areItemsReadOnly || dskb.areGroupsReadOnly || group.isItemReadOnly || group.isGroupReadOnly" class="dskb-properties-container">
            <div class="dskb-property">
                <input type="text" ng-model="group[dskb.groupNameField]"/>
            </div>
            <table ng-hide="group.isCollapsed" class="dskb-property dskb-property-editor dskb-property-table">
                <tr>
                    <td>
                        <img ng-if="!dskb.isGroupItemsCountVisible && dskb.assignableResources && group.assignedResource.imageUrl" ng-src="{{ group.assignedResource.imageUrl }}" class="dskb-property-image"/>
                    </td>
                    <td class="dskb-property-table">
                        <select ng-if="!dskb.isGroupItemsCountVisible && dskb.assignableResources" ng-model="group.assignedResource" ng-options="resource as resource.name for resource in dskb.assignableResources" class="dskb-property-secondary"></select>
                        <span ng-if="dskb.isGroupItemsCountVisible || !dskb.assignableResources">{{ dskb.getItemsInGroup(group).length }} {{ dskb.itemsLabel }}</span>
                    </td>
                </tr>
            </table>
            <table ng-hide="group.isCollapsed" class="dskb-property dskb-property-editor dskb-property-table">
                <tr>
                    <td>
                        <span class="dskb-property-label">{{ dskb.stateLabel }}:</span>
                    </td>
                    <td class="dskb-property-table">
                        <select ng-model="group.state" ng-options="groupState as groupState.name for groupState in dskb.groupStates"></select>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</div>
